<template>
  <div class="task-permanent-decision push-list">
    <van-search v-model="keywords" placeholder="搜索" @search="onRefresh" />
    <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
      <van-list
        v-model="loading"
        :finished="finished"
        finished-text="没有更多了"
        @load="onLoad"
      >
        <div class="gm-list-card" v-for="item in list" :key="item.Id">
          <van-tag v-if="item.UrgentTask" class="fix-tag" type="danger">
            <span>紧急</span>
          </van-tag>
          <van-cell class="gm-list-card-header" :title="item.Number">
            <span>{{ item.Step }}</span>
            <div class="status-text success" v-if="!item.ResponseTimeout">
              <van-icon name="passed" /> 响应正常
            </div>
            <div class="status-text danger" v-else>
              <i class="iconfont iconicon-zhiliuchaoshi1"></i> 响应超时
            </div>
            <div class="status-text success" v-if="!item.MaintenanceTimeout">
              <van-icon name="passed" /> 维修正常
            </div>
            <div class="status-text danger" v-else>
              <i class="iconfont iconicon-zhiliuchaoshi1"></i> 维修超时
            </div>
          </van-cell>
          <van-cell @click="$router.push(`/task-detail/${item.Id}`)">
            <div class="cont-title van-ellipsis">
              {{ item.OrderDescription }}
            </div>
            <ul class="cont-desc">
              <li>故障类型：{{ item.FailureType }}</li>
              <li>报修时间：{{ item.PresentationTime }}</li>
              <li>
                维修人员：{{
                  `${item.RepairPersonnelName || "无"}
                    ${item.RepairPersonnelPhone || ""}`
                }}
              </li>
              <li>
                协助人员：{{
                  `${item.AssistantsName || "无"}
                    ${item.AssistantsPhone || ""}`
                }}
              </li>
            </ul>
          </van-cell>
          <van-cell class="gm-list-card-footer">
            <van-button
              class="operate-btn"
              type="default"
              size="small"
              @click="handleCompleleCM(item)"
            >
              完成对策
            </van-button>
          </van-cell>
        </div>
      </van-list>
    </van-pull-refresh>
  </div>
</template>

<script>
import {
  Pad_Repair_TemporaryCountermeasureList, // 获取列表
  Pad_Repair_CompCounTask, // 完成对策
} from "../../api/index";

export default {
  name: "TaskPermanentDecision",
  data() {
    return {
      keywords: "",
      // 数据
      list: [],
      // 下拉刷新loading
      refreshing: false,
      // 上拉加载loading
      loading: false,
      // 数据全部加载完成
      finished: false,
      //列表分页
      taskPageCtrl: {
        page: 1,
        size: 5,
      },
    };
  },
  methods: {
    // 刷新
    onRefresh() {
      this.refreshing = true;
      this.finished = false;
      // 重新加载数据
      this.loading = true;
      this.onLoad();
    },
    // 加载数据
    onLoad() {
      if (this.refreshing) {
        // 清空列表数据
        this.list = [];
        this.taskPageCtrl = {
          page: 1,
          size: 5,
        };
        this.refreshing = false;
      }

      if (!this.finished) {
        const params = {
          Page: this.taskPageCtrl.page,
          Number: this.taskPageCtrl.size,
          KeyWords: this.keywords,
        };

        Pad_Repair_TemporaryCountermeasureList(params)
          .then((res) => {
            // 加载状态结束
            this.loading = false;

            if (res.ReturnResult === "1") {
              this.list.push(...res.ReturnData.children);
              // 数据全部加载完成
              if (this.list.length === res.ReturnData.TotalRows) {
                this.finished = true;
              }
              this.taskPageCtrl.page++;
            } else {
              this.$notify(res.Message);
            }
          })
          .catch((err) => {
            this.$notify(err);
          });
      }
    },
    handleCompleleCM(item) {
      this.$dialog
        .confirm({
          message: "确认完成对策吗？",
        })
        .then(() => {
          const params = {
            RepairId: item.Id,
            Remarks: "",
          };
          Pad_Repair_CompCounTask(params)
            .then((res) => {
              if (res.ReturnResult === "1") {
                this.$dialog
                  .alert({
                    message: res.Message,
                    className: "success",
                  })
                  .then(() => {
                    this.onRefresh();
                  });
              } else {
                this.$dialog.alert({
                  message: res.Message,
                });
              }
            })
            .catch((err) => {
              this.$notify(err);
            });
        })
        .catch(() => {
          // on cancel
        });
    },
  },
};
</script>